<template>
	<div class="section">
		<div class="section-desc">
			<!-- {{msg}} -->
			<slot name="title"></slot>
			<slot name="content"></slot>
		</div>
	</div>
</template>

<script>
	export default {
		data() {
			return {
				msg: '',
			}
		},
	}
</script>

<style scoped>
	/* html {
	  font-size: calc(100vw / 100);
	}
	 */

	
	.section {
		/* height: 18vh; */
		width: 28rem;
		height: 6.5rem;
		/* 占屏幕的50% */
		/* background: url('background1.jpg') center/cover no-repeat;  背景图  */
	 	background-image: linear-gradient(rgba(208, 207, 254, 1), rgba(205, 218, 252, 0.5));
		position: relative;
		display: flex;
		text-align: center;
		justify-content: center;
		width: 100vw; 
		/* 垂直居中 */
	}
	
	.section-desc {
		position: relative;
		font-family: 'PingFang SC';
		font-weight:bold;
		font-size: 1.5rem;
		text-align: center;
		/* justify-content: center; */
		color: rgb(25, 25, 25);
		padding: 1rem;
		/* 垂直居中 */
		/* margin: 150px; */
		
	}
</style>